<template>
	<!--现金流量表管理-->

	<div class="tobeDone">
		<tableIndex
			:tableData="tableData"
			:tableHead="tableHead"
			:isIndex="true"
			:isSelection="true"
			:isRadio="false"
			:fields="state.fields"
			:height="500"
			:page="state.page"
			@selectChange="selectChange"
			@searchList="searchList"
			@page-change="pageChange"
			@resetList="resetList"
		>
			<template #btns>
				<el-button
					style="float: right"
					size="small"
					class="look"
					type="primary"
					@click="addOptinsHandel"
					><svg-icon
						class="m-r5"
						icon-class="project-add-icon"
					/>创建</el-button
				>
			</template>
			<template #operate>
				<el-table-column label="操作" width="200" fixed="right">
					<template #default="{ row }">
						<el-button
							size="small"
							class="look"
							type="primary"
							@click="editOptinsHandel(row)"
							>编辑</el-button
						>
						<el-button
							size="small"
							class="look"
							type="primary"
							@click="deleteOptinsHandel(row)"
							>删除</el-button
						>
					</template>
				</el-table-column>
			</template>
		</tableIndex>
		<!-- 创建弹窗 -->
		<public-dialog
			:title="'新建分类'"
			:width="'40%'"
			:confirmButtonTitle="'保存'"
			v-model:visible="visible"
			@onConfirm="onConfirm"
		>
			<el-form :inline="true" label-width="80px" :model="state.formData">
				<el-row>
					<el-col :span="12">
						<el-form-item label="分类名称">
							<el-input v-model="state.formData.user" placeholder="" />
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="上级">
							<el-select v-model="state.formData.user" placeholder="">
								<el-option label="区域一" value="shanghai"></el-option>
								<el-option label="区域二" value="beijing"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="24">
						<el-form-item label="备注说明">
							<el-input
								v-model="state.formData.user"
								type="textarea"
								placeholder=""
							/>
						</el-form-item>
					</el-col>
					<el-col :span="24">
						<el-form-item label="启用状态">
							<el-switch v-model="state.formData.user"></el-switch>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="排序">
							<el-input v-model="state.formData.user" placeholder="" />
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
		</public-dialog>
	</div>
</template>

<script setup>
import tableIndex from "@/components/table/index.vue";
import PublicDialog from "@/components/PublicDialog.vue";
import { fundManagementApi } from "@/api/businessFinance";
import { fundApi } from "@/api/project";
import { ElForm, ElRow, ElCol, ElButton, ElSwitch,ElSelect } from "element-plus";
import { ref, onMounted, reactive, watch } from "vue";
import { useRouter } from "vue-router";
let Router = useRouter();

const state = reactive({
	formData: {},
	page: {
		page: 1,
		pageSize: 10,
		total: 0,
	},
	fields: [{ key: "keywords", label: "关键字", type: "input" }],
});
// const info = ref(null)
const visible = ref(false);
const tableData = ref([{}]);
const tableHead = ref([
	{
		prop: "projectName",
		label: "项目名称",
	},
	{
		prop: "projectId",
		label: "上级名称",
	},
	{
		prop: "year",
		label: "创建时间",
	},
	{
		prop: "quarter",
		label: "合计",
	},
	{
		prop: "executeAmount",
		label: "创建人",
	},
]);

/* 删除 */
const deleteOptinsHandel = (row) => {};
//编辑
const editOptinsHandel = (row) => {
	Router.push({
		path: "/investmentProjectManagement/investmentProjects/investmentProjectInformation/editCashFlowStatement",
		query: {},
	});
};
watch(()=>visible.value, value => {
  if (value) {
    state.formData = {}
  }
})
//新增
const addOptinsHandel = (row) => {
	visible.value = true;
};
//创建弹窗回调
const onConfirm = (row) => {};

//搜索接口请求
const searchList = (e) => {
	getPage(e);
};
const resetList = (e) => {
	getPage();
};
//分页变化
const pageChange = (e) => {
	state.page.page = e.page;
	state.page.pageSize = e.limit;
	getPage();
};
const getPage = (e) => {
	let obj = {
		pageNum: state.page.page,
		pageSize: state.page.pageSize,
		param: {
			...e,
		},
	};
	fundApi.getWeekPageList(obj).then((res) => {
		if (res.code == "200") {
			tableData.value = res.data.content;
			state.page.total = res.data.totalSize;
		}
	});
};
onMounted(() => {
	// getPage()
});
</script>

<style lang="scss" scoped>
.tobeDone {
	width: 100%;
	height: 100%;
}
.el-form-item,.el-select {
	width: 100%;
}
</style>
